<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button class="btn1">设置sessionStorage</button>
    <button class="btn2">获取sessionStorage</button>
    <button class="btn3">删除sessionStorage</button>
    <button class="btn4">删除所有sessionStorage</button>
    <script>
        // localstorage：只要不主动清除 一直存在  sessionStorage :时效性 ，在浏览器关闭的时候自动销毁；

        // sessionStorage是关闭浏览器选项卡的时候自动销毁 ； session 只能大退浏览器的时候销毁；
        // 1.设置sessionStorage
        document.querySelector(".btn1").onclick = function(){
            sessionStorage.setItem("myname","李四");
        }

        // 2.获取
        document.querySelector(".btn2").onclick = function(){
          console.log(   sessionStorage.getItem("myname"));
        }

        // 3.删除指定
        document.querySelector(".btn3").onclick = function(){
            sessionStorage.removeItem("myname")
        }
        // 4.删除所有
        document.querySelector(".btn4").onclick = function(){
            sessionStorage.clear();
        }

    </script>
</body>
</html>